import React from 'react';
import {inject,observer} from 'mobx-react';
import { Button,Input } from 'antd';
const { Search } = Input;

@inject('mainStore')
@observer
class  Main extends React.Component{
    va
    render(){
    // return  <div onClick={()=>{this.props.mainStore.addCount()}} >this is  {this.props.mainStore.count}</div>;
    return   <div>  
        
        <Search
      placeholder="input todo text"
      enterButton="add"
      size="large"
      onSearch={value => this.props.mainStore.addList(value)}
      allowClear='true'
    />
        
        {/* <Button type="primary" onClick={()=>{this.props.mainStore.addCount()}}>增加{this.props.mainStore.count}</Button>    */}
        
        {this.showList()}
        
        </div>
    ;
    }

    showList(){
       let todoListNode=[];
        const todoList=this.props.mainStore.todoList;
        todoList.forEach(element => {
        todoListNode.push(<div>{element.text}</div>);
        });
        return todoListNode;
    }
}

export default Main;